<template>
	<a-row class="mb-2">
		<a-col :span="24">
			<a-card>
				<a-space :size="10">
					<span> 版本： </span>
					<a-select v-model:value="config.version" @change="versionChangeCallback" style="width: 100px">
						<a-select-option
							v-for="item in config.versionList"
							:key="item.version"
							:value="item.version"
						>{{ item.version }}
						</a-select-option>
					</a-select>
					<span> 日志级别: </span>
					<a-select v-model:value="config.logLevel" style="width: 100px">
						<a-select-option
							v-for="item in config.logLevelList"
							:key="item.code"
							:label="item.name"
							:value="item.code"
						/>
					</a-select>
					<a-button type="primary" @click="openStepTestDraw">测试</a-button>

					<a-textarea v-model:value="config.remark" placeholder="请输入注释" style="width:800px" :rows="3" allowClear showCount></a-textarea>
					<a-modal v-model:open="config.stepTestFlag" zIndex="5000" title="请输入参数">
						<div class="jsoneditor" ref="jsonEditor" style="width: 100%; height: 600px"></div>
						<template #footer>
							<span class="dialog-footer">
								<el-button @click="config.stepTestFlag = false">取消</el-button>
								<el-button type="primary" @click="submitStepTest"> 提交 </el-button>
							</span>
						</template>
					</a-modal>
				</a-space>
			</a-card>
		</a-col>
	</a-row>
</template>

<script setup>
import {defineProps, onMounted, getCurrentInstance} from 'vue'
import processComponentApi from '@/api/process/processComponentApi'
import processApi from '@/api/process/processApi'
import JsonEditor from 'jsoneditor'
import 'jsoneditor/dist/jsoneditor.min.css'
import processVersionContentApi from '@/api/process/processVersionContentApi'
import {parseDefineToJson} from '@/utils'
import processTestApi from '@/api/process/processTestApi'
import {message} from 'ant-design-vue'
import {mergeStepConfigToFrontFile} from '@/utils'

const props = defineProps(['lf', 'properties', 'getResource', 'id', 'versionChangeCallback'])

const versionChangeCallback = () => {
	if (props.versionChangeCallback) {
		props.versionChangeCallback(config.version)
	}
}
const config = ref({
	versionList: [],
	version: null,
	logLevel: null,
	versionId: null,
	orgId: null,
	systemFlag: false,
	remark:"",
	nodeId: null,
	logLevelList: [],
	stepTestFlag: false
})
onMounted(() => {
	initValue()
	queryVersionList()
	queryLogLevelList()

})

const initValue = () => {
	config.value = {...props.properties?.basicConfig}
	config.value.nodeId = props.id
}

const submitStepTest = async () => {
	//获取一把tid
	const tid = await processTestApi.getTid({})

	const frontFile = await props.getResource()

	const value = paramEditor.get()

	const obj = await processTestApi.stepRun({
		id: props.lf.id,
		frontFile: frontFile,
		param: value,
		stepCode: config.value.nodeId,
		tid: tid
	})
	message.info('执行成功，结果=>' + JSON.stringify(obj))
}

const openStepTestDraw = () => {
	config.value.stepTestFlag = true
	//初始化
	if (!paramEditor) {
		nextTick(() => {
			initJsonEditor()
			updateTestParam()
		})
	} else {
		updateTestParam()
	}
}
const jsonEditor = ref()
let paramEditor = null

const initJsonEditor = () => {
	const options = {
		modes: ['code', 'tree', 'form', 'text', 'preview'],
		mode: 'code'
	}
	paramEditor = new JsonEditor(jsonEditor.value, options)
}

const updateTestParam = async () => {
	const obj = await getCurrentInputDefine()
	let define = parseDefineToJson(obj)
	if (!define) {
		define = {
			'': ''
		}
	}
	paramEditor.update(define)
}

const getCurrentInputDefine = async () => {
	const frontFile = await props.getResource()

	//需要调用后端查询接口定义
	const read = await processVersionContentApi.getCurrentInputDefine({
		id: props.lf.id,
		processId: null,
		processVersion: config.value.version,
		frontFile: frontFile,
		stepCode: config.value.nodeId
	})
	return read
}
const queryVersionList = async () => {
	if (!props.properties?.component?.type) {
		return
	}
	const data = await processComponentApi.queryVersionList(props.properties.component.type)
	config.value.versionList = data
}

const queryLogLevelList = async () => {
	const data = await processApi.queryLogLevelList({})
	config.value.logLevelList = data
}
const getConfig = () => {
	//
	let version = config.value.versionList.find((s) => {
		return s.version == config.value.version;
	});
	if(!version){
		version = {}
	}
	return {
		version: version.version,
		remark:config.value.remark,
		orgId: version.orgId,
		versionId: version.id,
		systemFlag: version.systemFlag,
		logLevel: config.value.logLevel
	}
}
defineExpose({
	getConfig
})
</script>

<style scoped lang="less"></style>
